<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
<title>使用XML DOM对象读取XML文件</title>
<style>
*{
font-size:12px;}
#box{
  width: 777px;
  height: 482px;
  background-image: url("images/bg.jpg");
}
.content{
  width: 551px;
  height: 253px;
  padding-top: 239px;
  margin-left: 204px;
}
</style>
<script type="text/javascript">
var txt='<?xml version="1.0" encoding="utf-8"?>\n' +
          '<goodss>\n' +
          '<goods name="明日***数码像机">\n' +
          '<type>IT数码</type>\n' +
          '<goodsunit>台</goodsunit>\n' +
          '<price>2000(元)</price>\n' +
          '</goods>\n' +
          '<goods name="明日****笔记本电脑">\n' +
          '<type>IT数码</type>\n' +
          '<goodsunit>台</goodsunit>\n' +
          '<price>6666.6(元)</price>\n' +
          '</goods>\n' +
          '<goods name="明日******显示器">\n' +
          '<type>IT数码</type>\n' +
          '<goodsunit>台</goodsunit>\n' +
          '<price>888.6(元)</price>\n' +
          '</goods>\n' +
          '</goodss>';
function readXML() {
    if (window.DOMParser) {
      parser=new DOMParser();
      xmldoc=parser.parseFromString(txt,"text/xml");
    } else {// Internet Explorer
      xmldoc=new ActiveXObject("Microsoft.XMLDOM");
      xmldoc.async=false;
      xmldoc.loadXML(txt);
    }
    createTable(xmldoc);
}
function createTable(xmldoc) {
	var table = document.createElement("table");
	table.setAttribute("width","100%");
	table.style.borderCollapse="collapse";
	parentTd.appendChild(table);     //在指定位置创建表格
	var header = table.createTHead();
	header.bgColor="#EEEEEE";  //设置表头背景
	var headerrow = header.insertRow(0);
	headerrow.style.height="27px";  //设置表头高度
	headerrow.insertCell(0).appendChild(document.createTextNode("商品名称"));
	headerrow.insertCell(1).appendChild(document.createTextNode("类别"));
	headerrow.insertCell(2).appendChild(document.createTextNode("单位"));
	headerrow.insertCell(3).appendChild(document.createTextNode("单价"));
    headerrow.style.textAlign="center";
    headerrow.style.border="1px solid #0000FF";
	var goodss = xmldoc.getElementsByTagName("goods");
	for(var i=0;i<goodss.length;i++) {
		var g = goodss[i];
		var name = g.getAttribute("name");
		var type = g.getElementsByTagName("type")[0].firstChild.data;
		var goodsunit = g.getElementsByTagName("goodsunit")[0].firstChild.data;
		var price = g.getElementsByTagName("price")[0].firstChild.data;
		var row = table.insertRow(i+1);
		row.style.height="27px";     //设置行高
        row.style.textAlign="center";
        row.style.border="1px solid #0000FF";
		row.insertCell(0).appendChild(document.createTextNode(name));
		row.insertCell(1).appendChild(document.createTextNode(type));
		row.insertCell(2).appendChild(document.createTextNode(goodsunit));
		row.insertCell(3).appendChild(document.createTextNode(price));
	}
}
</script>
</head>
<body onLoad="readXML()">
<div id="box">
  <div class="content">
    <div id="parentTd"></div>
  </div>
</div>
</body>
</html>